<template>
  <div class="leftContent height_100">
    <header>会议</header>
    <div class="navlist">
      <singleRecord
        v-for="item in navList"
        :key="item.id"
        :name="item.name"
        :src="item.src"
        @click.native="jumpTo(item)"
        :unread="item.unread"
        :id="item.id"
      >
      </singleRecord>
    </div>
  </div>
</template>

<script>
import singleRecord from '@/components/searchBox/components/singleRecord'
export default {
  components: {
    singleRecord
  },
  computed: {
    navList () {
      return [
        {
          id: 1,
          name: '待办会议',
          src: require('@/assets/conference/agendaCf.png'),
          path: '/conference/agendaCf/main'
        },
        {
          id: 2,
          name: '加入会议',
          src: require('@/assets/conference/joinCf.png'),
          path: '/conference/joinCf'
        },
        {
          id: 3,
          name: '快速会议',
          src: require('@/assets/conference/quickCf.png')
        },
        {
          id: 4,
          name: '预定会议',
          src: require('@/assets/conference/reserveCf.png'),
          path: '/conference/reserveCf'
        },
        {
          id: 5,
          name: '历史会议',
          src: require('@/assets/conference/historyCf.png'),
          path: '/conference/historyCf'
        }
      ]
    }
  },
  watch: {
    '$route.path': {
      immediate: true,
      handler (val) {
        this.navList.forEach(item => {
          if (val === item.path && item.id !== 3) {
            this.$store.commit('conference/set_currentId', item.id)
            this.$store.commit('conference/set_rightHeader', item)
          }
        })
      }
    }
  },
  methods: {
    jumpTo (item) {
      if (item.id === 3) {
        // 建立快速会议
        this.$store.dispatch('conferenceRoom/createQuickConference', { cfName: this.$store.state.user.userInfo.user_name + '的会议' }).then(res => {
          if (res.data && res.data.code === 200) {
            this.$store.commit('conferenceRoom/set_cf_type', 'conferenceRoom')
          }
        })
      } else {
        this.$router.push(item.path)
      }
    }
  },
  created () {
    this.jumpTo(this.navList[0])
  },
  beforeDestroy () {
    this.$store.commit('conference/set_currentId', '')
  }
}
</script>

<style lang="scss" scoped>
.leftContent {
  width: 300px;
  border-right: 1px solid #dee3ec;
  header {
    // background-color: skyblue;
    height: 72px;
    font-size: 18px;
    color: #0D172C;
    line-height: 72px;
    border-bottom: 1px solid #dee3ec;
    padding-left: 15px;
  }
  .navlist {
    height: calc(100% - 72px);
    // background-color: plum;
    .message {
      padding: 16px 0 16px 15px;
    }
  }
}
</style>
